import React from "react"
import Sidebar from "@/components/dashboard/sidebar"
import Breadcrumb from "@/components/dashboard/breadcrumb"
import ThemeToggle from "@/components/theme/theme-toggle"
import UserMenu from "@/components/dashboard/user-menu"

type Props = {
  children: React.ReactNode
}

/**
 * 工作台布局
 */
const DashboardLayout = (props: Props) => {
  const { children } = props

  return (
    <div className="flex h-screen bg-gray-50 dark:bg-gray-900">
      <Sidebar />

      <div className="flex-1 flex flex-col overflow-hidden">
        <header className="flex items-center justify-between p-4 bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700">
          <Breadcrumb />

          <div className="flex items-center space-x-4">
            <ThemeToggle />
            <UserMenu />
          </div>
        </header>

        <main className="flex-1 overflow-y-auto p-6">
          <div className="max-w-8xl mx-auto">{children}</div>
        </main>
      </div>
    </div>
  )
}

export default DashboardLayout
